<template>
	<div class="empty">
		<!-- 根据type的值显示不同的图片 -->
		<img src="./images/empty-image-search.png" v-if="type==='search'" alt="">
		<img src="./images/empty-image-error.png" v-else-if="type==='error'" alt="">
		<img src="./images/empty-image-default.png" v-else alt="">
		<!-- 提示文本 -->
		<p>{{title}}</p>
		<!-- 插槽内容 -->
		<slot></slot>
	</div>
</template>

<script>
	export default {
		props: {
			// 提示文本
			title: {
				type: String,
				default: '空空如也！'
			},
			// 类型
			type:{
				type:String,default:'normal'
			}
		}
	}
</script>

<style scoped lang="scss">
	.empty {
		text-align: center;
		color:#777;
		img {
			width: 50%;
		}
	}
</style>
